<!--
* description: 采购管理-网点对应仓库维护
* author: hzm
* createdDate: 2021-1-21
-->
<template>
  <div class="app-container app-container-table">
    <one-table-template
      ref="multipleTable"
      :dynamic-buttons="tableButtons"
      :dynamic-components="tableComponents"
      :dynamic-api-config="dynamicApiConfigs"
      :dynamic-table-cols="tableCols"
      :dynamic-form-fields="formField"
      :dynamic-is-show-select="false"
      :dynamic-is-init-table="true"
      :dynamic-is-fix-choose="false"
      :dynamic-is-fix-index="false"
      :dynamic-is-show-more-btn="true"
      :dynamic-api-style="'restful'"
    />
    <edit
      :key="editPopupsKey"
      :dynamic-edit-row-data="editRowData"
      :popups-visible="editPopupsVisible"
      :popups-state="editPopupsState"
      :dynamic-api-style="'restful'"
      :edit-row-data="editRowData"
      @close="close"
    />
  </div>
</template>

<script>
import { formMixins } from '@/components/mixins/formMixins'
import { oneTableWithViewTemplateMixins } from '@/components/mixins/oneTableWithViewTemplateMixins'
import OneTableTemplate from '@/components/templates/oneTable'
import { orgApis } from '@/api/paSparePartsManagement'
import { exportExcel } from '@/utils/getTimeString.js'

export default {
  name: 'CorresWarehouseMain',
  components: {
    OneTableTemplate,
    Edit: () => import('./edit')
  },
  mixins: [oneTableWithViewTemplateMixins, formMixins],
  data() {
    return {
      editRowData: {},
      dynamicApiConfigs: orgApis.orderManagementQuery,
      // 动态生成网格列
      tableCols:
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path] &&
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path].tableCols &&
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path].tableCols
          .length > 0
          ? this.$ConfigCache.CacheConfig.cacheData[this.$route.path].tableCols
          : [
            {
              prop: 'controlBtn',
              label: '操作', // 操作
              codeField: 'controlBtn',
              width: 100,
              align: 'center',
              isComponent: true,
              comps: [
                {
                  compKey: 'propKey1',
                  labelName: '修改', // 编辑
                  align: 'center',
                  // codeField: "editControlBtn",
                  component: () => import('@/components/org/linkButton'),
                  clickEvent: (index) => this.edit(index)

                }
              ]
            },
            {
              prop: 'dlrCode',
              label: '网点编码',
              align: 'center'
            },
            {
              prop: 'dlrShortName',
              label: '网点名称',
              align: 'center'
            },
            {
              prop: 'warehouseCode',
              label: '仓库编码',
              align: 'center'
            },
            {
              prop: 'warehouseName',
              label: '仓库名称',
              align: 'center'
            },
            {
              prop: 'isEnableCn',
              label: '状态',
              align: 'center'
            },
            {
              prop: 'remark',
              label: '备注',
              align: 'center'
            }
          ],
      tableComponents:
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path] &&
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path]
          .tableComponents &&
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path]
          .tableComponents.length > 0
          ? this.$ConfigCache.CacheConfig.cacheData[this.$route.path]
            .tableComponents
          : [
            {
              compKey: 'comKey1',
              labelName: '网点编码：',
              codeField: 'dlrName',
              textField: 'dlrCode',
              component: () => import('@/views/ve/planReport/components/multipleSearchInput'),
              type: 'inputText',
              isMust: true,
              // isRequire: true,
              dataToObject: {
                // 控制弹窗页面 搜索 网格 元素
                tableComponents: [
                  {
                    compKey: 'compKey1',
                    labelName: '网点编码：',
                    codeField: 'dlrCode',
                    component: () => import('@/components/org/commonInput'),
                    type: 'inputText',
                    isMust: true,
                    span: 8
                  },
                  {
                    compKey: 'compKey2',
                    labelName: '网点名称：',
                    codeField: 'dlrShortName',
                    component: () => import('@/components/org/commonInput'),
                    type: 'inputText',
                    isMust: true,
                    span: 8
                  }
                ],
                tableCols: [
                  {
                    prop: 'dlrCode',
                    label: '网点编码'
                  },
                  {
                    prop: 'dlrShortName',
                    label: '网点名称'
                  }
                ],
                formField: {
                  dlrShortName: '',
                  dlrCode: ''
                },
                oFields: 'dlrShortName,dlrCode',
                returnField: {
                  prop: 'dlrCode',
                  label: '网点编码'
                },
                api: orgApis.queryOrgDlrCodes
              },
              span: 6
            },
            {
              compKey: 'compKey2',
              labelName: '网点名称：',
              codeField: 'dlrName',
              lookuptype: 'VE0207',
              component: () => import('@/components/org/commonInput'),
              type: 'inputText',
              isMust: true,
              span: 6
            },
            // 入库仓库
            {
              compKey: 'compKey3',
              labelName: '仓库编码：',
              codeField: 'warehouseCode',
              component: () => import('@/components/org/commonInput'),
              type: 'inputText',
              isMust: true,
              span: 6
            },
            // 审核状态
            {
              compKey: 'compKey4',
              labelName: '仓库名称：',
              codeField: 'warehouseName',
              component: () => import('@/components/org/commonInput'),
              oFields: 'AsId,AsText',
              type: 'inputText',
              isMust: true,
              span: 6
            },
            {
              compKey: 'compKey4',
              labelName: '状态：',
              codeField: 'isEnable',
              component: () => import('@/components/org/userSeleapiConfig'),
              oFields: 'statusId,statusText',
              options: [
                { statusId: '1', statusText: '启用' },
                { statusId: '0', statusText: '停用' }
              ],
              type: 'dropdownList',
              isMust: false,
              span: 6
            }
          ],
      tableButtons: [
        {
          conmpKey: 'btenKey1',
          type: 'primary',
          size: 'small',
          text: '查询',
          name: 'search',
          clickEvent: () => this.queryTable(1),
          position: 'right'
        },
        {
          compKey: 'comKey2',
          type: '',
          size: 'small',
          name: 'importTemplate',
          position: 'upload',
          clickEvent: () => this.handleChange(),
          text: '导入'
        },
        {
          compKey: 'comKey3',
          type: 'text',
          size: 'small',
          name: '',
          position: 'upload',
          click: (event) => { this.templateDownload() }
        },
        {
          conmpKey: 'btenKey3',
          type: '',
          size: 'small',
          clickEvent: () => this.export(),
          text: this.$t('sys.button.export'),
          name: 'export',
          position: 'right' // 导出
        },
        {
          conmpKey: 'btenKey2',
          type: '',
          size: 'small',
          text: '重置',
          name: 'reset',
          clickEvent: () => this.reset(),
          position: 'right'
        }
      ],
      formField: this.$utils.getFormField(this, {
        dlrCode: '',
        dlrName: '',
        warehouseCode: '',
        warehouseName: '',
        isEnable: ''
      })
    }
  },
  mounted() {
    // this.queryTable(1)
    this.$refs.multipleTable.list = [
      {
        index: 1
      }
    ]
  },
  methods: {
    templateDownload() {
      const fileName = this.$utils.fileNameWithTime('网点对应仓库维护模板.xlsx')
      this.$requestAPI({
        apiUrl: orgApis.orderListQueryDown.APIUrl,
        variables: { dataType: 'excel' }
      }).then(res => {
        this.$utils.downloadFile(res, fileName)
      }).catch(err => {
        console.log(err)
      })
    },

    handFileListChange(file, fileList) {
      if (this.beforeAvatarUpload(file)) {
        this.handleChanged(file)
      }
    },
    beforeAvatarUpload(file) {
      if (file.size > 50 * 1024 * 1024) {
        this.$message({
          message: '文件大小不能超过50M',
          type: 'warning'
        })
        return false
      }
      const fileType = file.name.substr(file.name.lastIndexOf('.') + 1)
      if (fileType != 'xls' && fileType != 'xlsx') {
        this.$message({
          message: '只能导入后缀为xls,xlsx的文件！',
          type: 'warning'
        })
        return false
      }
      return true
    },
    handleChanged(param) {
      const loading = this.$loading({
        lock: true,
        text: '导入中...',
        background: 'rgba(0, 0, 0, 0.5)'
      })
      const that = this
      const url = orgApis.orderListQueryExtel.APIUrl
      that
        .$requestUpload(url, param)
        .then(response => {
          loading.close()
          if (response.result === '1') {
            this.$message({
              message: '导入成功',
              type: 'success'
            })
            that.queryTable()
          } else {
            this.$message({
              message: response.msg,
              type: 'warning'
            })
          }
        })
        .catch(err => {
        })
        .finally(() => {
          loading.close()
      })
    },
    close(type) {
      this.editPopupsVisible = type
    },
    edit(index) {
      this.editPopupsState = 'edit'
      this.editPopupsVisible = true
      this.editRowData = this.$utils.deepCopy(this.$refs['multipleTable'].list[index])
    },
    export() {
      // 导出
      // outsourcingsupplierqueryexportexcel
      exportExcel(this.formField, orgApis.orderManagementExtele.APIUrl, orgApis.orderManagementExtele.ServiceCode, '网点对应仓库维护')
    }
  }
}
</script>

<style>
</style>
